<template>
  <div class="content">
    <p class="title">轮播图</p>
    <div class="swiper-box flex ac fw">
      <el-upload :show-file-list="false" :auto-upload="false" class="avatar-uploader" action="#">
        <i class="el-icon-plus avatar-uploader-icon"></i>
      </el-upload>
      <img class="img" src="../../assets/icon/logo.png" />
    </div>
    <p class="title">精选案例</p>
    <div class="swiper-box flex ac fw case-box">
      <el-upload :show-file-list="false" :auto-upload="false" class="avatar-uploader" action="#">
        <i class="el-icon-plus avatar-uploader-icon"></i>
      </el-upload>
      <img class="img" src="../../assets/icon/logo.png" />
    </div>
    <p class="title">公司介绍</p>
    <div class="tinymce-box flex">
      <tinymce @input="tinymceInput"></tinymce>
      <div class="html-box" v-html="richText"></div>
    </div>
    <el-button type="primary">保存</el-button>
  </div>
</template>

<script>
  import Tinymce from "@/components/tinymce/tinymce";
  export default {
    name: '',
    components: {
      Tinymce
    },
    data() {
      return {
        richText: ''
      }
    },
    watch: {},
    computed: {

    },
    mounted() {},
    methods: {
      tinymceInput(e) {
        const regex = new RegExp('img', 'gi')
        e = e.replace(regex, `img style="max-width:100%;object-fit: cover;"`)
        this.richText = e;
      }
    }
  }

</script>

<style lang="scss" scoped>
  @import './index.scss';
</style>
